import React from 'react';

export class CommentList extends React.Component {
  render() {
    const { list, handleDelById } = this.props;

    return (
      <ul>
        {list.map((item) => {
          return (
            <li key={item.id}>
              <h3>评论人: {item.username}</h3>
              <p>评论内容：{item.content}</p>
              <button
                // 3. 子接收回调函数,并调用
                onClick={() => handleDelById(item.id)}
              >
                删除
              </button>
            </li>
          );
        })}
      </ul>
    );
  }
}
